<HTML>
<!--
THE JAVASCRIPT COOKBOOK by Erica Sadun, webrx@mindspring.com
J. Brook Monroe, mrprogguy@techie.com
Copyright (c)2000 by Charles River Media. All Rights Reserved.
This applet can only be re-used or modifed by license holders of the
JavaScript Cookbook CD-ROM. Credit must be given in the source
code and this copyright notice must be maintained. If you do
not hold a license to the JavaScript Cookbook, you may NOT
duplicate or modify this code for your own use.
Use at your own risk. No warranty is given or implied of the suitability
of this applet for any specific application. Neither Erica Sadun,
J. Brook Monroe nor Charles River Media will be held responsible for any
unwanted effects due to the use of this applet or any derivative.
-->
<HEAD>
<TITLE>Point and Click I</TITLE>
<SCRIPT LANGUAGE="JavaScript1.2"><!--
function getMove(evt)
{
document.forms[0].atx.value = evt.layerX;
document.forms[0].aty.value = evt.layerY;
return routeEvent(evt); // Just in case
}
function getUp(evt)
{
var whichBtn;
document.forms[0].upcoords.value=evt.layerX+','+evt.layerY;
return routeEvent(evt);
}
function getDown(evt)
{
var whichBtn;
document.forms[0].downcoords.value=evt.layerX+','+evt.layerY;
// Left button is 1, right button is 3
whichBtn = (evt.which == 3) ? "right" : "left";
document.forms[0].button.value = whichBtn;
var mods = parseInt(evt.modifiers);
var modString = "";
if (mods & Event.ALT_MASK) // 1
modString += "ALT ";
if (mods & Event.CONTROL_MASK) // 2
modString += "CTRL ";
if (mods & Event.SHIFT_MASK) // 4
modString += "SHIFT ";
if (mods & Event.META_MASK) // 8???
modString += "META";
document.forms[0].mods.value = modString;
return routeEvent(evt);
}
function Setup()
{
window.captureEvents(Event.MOUSEMOVE | Event.MOUSEDOWN | Event.MOUSEUP);
window.onMouseMove=getMove;
window.onMouseDown=getDown; // Disco reference?
window.onMouseUp=getUp;
}
function TidyUp()
{
window.releaseEvents(Event.MOUSEMOVE | Event.MOUSEDOWN | Event.MOUSEUP);
}
//-->
</SCRIPT>
</HEAD>
<BODY onUnload="TidyUp()">
<FONT COLOR="007777"><H1><IMG SRC="../GRAFX/UTENS.JPG" WIDTH=80 HEIGHT=50 ALIGN = LEFT>Point and Click I</H1></FONT>
<BLOCKQUOTE><FONT COLOR="770000">
Now you can track mouse clicks as well as movements!
</FONT>
<FORM>Mouse X: <INPUT TYPE="text" SIZE=4 NAME="atx"> Mouse Y: <INPUT TYPE="text" SIZE=4 NAME="aty"><BR>
Mouse down at <INPUT TYPE="text" SIZE=8 NAME="downcoords"> with <INPUT TYPE="text" SIZE=10 NAME="button"> button<BR>
and keyboard modifiers <INPUT TYPE="text" SIZE=24 name="mods"><BR>
Mouse up at <INPUT TYPE="text" SIZE=8 NAME="upcoords">
</FORM><p>
<SCRIPT LANGUAGE="JavaScript1.2">Setup()</SCRIPT>
<FONT COLOR="007777"><H2>Discussion</H2></FONT>
<FONT SIZE=4>
Capturing and handling mouse button press and release events is very simple with the new event handlers in JavaScript 1.2.
The event system distinguishes between the left and right mouse buttons (values 1 and 3, respectively), but there
doesn't seem to be a way to catch both buttons down at once!
</FONT>
<BR><BR><h5>Copyright ©2000 by Charles River Media, All Rights Reserved</h5>
</BODY>
</HTML>